<div>
    <div class="row ">
        <div class="col-md-2" style="padding-right:0px">
            <vc:create path="charge/chargeRuleDiv" callBackListener="chargeRule"></vc:create>
        </div>
        <div class="col-md-10 margin-top-xs vc-org-page">
            <div class="bg-white border-radius padding">
                <h5 class="role-title">{{chargeRuleInfo.curChargeRule.ruleName}}</h5>
                <div class="role-context ">{{chargeRuleInfo.curChargeRule.remark}}</div>
                <div class="line-x margin-top"></div>
                <div class="role-menu flex justify-start vc-org margin-top">
                    <ul v-if="chargeRuleInfo.chargeTypes && chargeRuleInfo.chargeTypes.length>0">
                        <span  v-for="(chargeType,index) in chargeRuleInfo.chargeTypes" @click="_switchChargeType(chargeType)"
                               :class="{'active':chargeRuleInfo.curChargeType.statusCd == chargeType.statusCd}">
                            {{chargeType.name}}
                        </span>
                    </ul>
                    <ul v-else>
                        <li>请先添加充电类型</li>
                    </ul>
                </div>
               <div>
                    <vc:create path="charge/chargeRuleFee"></vc:create>
                </div>
            </div>
        </div>
    </div>
</div>